import React, { useState, useRef, useEffect } from 'react';
import { 
  View, 
  Text, 
  StyleSheet, 
  TextInput, 
  TouchableOpacity, 
  ScrollView, 
  SafeAreaView,
  ActivityIndicator,
  Alert,
  Clipboard,
  Image,
  Platform
} from 'react-native';
import { useNavigation } from '@react-navigation/native';
import { NativeStackNavigationProp } from '@react-navigation/native-stack';
import { RootStackParamList } from '../../navigation/types';
import * as FileSystem from 'expo-file-system';
import * as MediaLibrary from 'expo-media-library';
import * as Permissions from 'expo-permissions';

// 创建彩色边框组件
const ColorfulBorder = ({ children, style }) => {
  return (
    <View style={[styles.colorfulBorderOuter, style]}>
      <View style={styles.colorBorderLeft}></View>
      <View style={styles.colorBorderTop}></View>
      <View style={styles.colorBorderRight}></View>
      <View style={styles.colorBorderBottom}></View>
      <View style={styles.colorfulBorderInner}>
        {children}
      </View>
    </View>
  );
};

const AIImageGenerationScreen = () => {
  const navigation = useNavigation<NativeStackNavigationProp<RootStackParamList>>();
  const scrollViewRef = useRef<ScrollView>(null);
  
  // API相关常量
  const apiUrl = 'https://api.coze.cn/v3/chat';
  const apiKey = "Bearer pat_72lCfOZdDlQRo5YET5kK2w4ookRhbO4oqRGQCaq7BwxfxzP9TTgRQLca6pxzWjNE";
  const botId = "7490455634098896959";
  const userId = "123123***";
  
  // 输入相关状态
  const [inputText, setInputText] = useState('');
  const [textLength, setTextLength] = useState(0);
  const maxLength = 200;
  
  // 图片类型模态框状态
  const [typeModalVisible, setTypeModalVisible] = useState(false);
  
  // 选项状态
  const [selectedType, setSelectedType] = useState('动漫人物');
  const [selectedStyle, setSelectedStyle] = useState('写实');
  const [selectedEffect, setSelectedEffect] = useState('优质');
  
  // 生成状态
  const [isGenerating, setIsGenerating] = useState(false);
  const [errorMessage, setErrorMessage] = useState('');
  
  // 生成结果状态
  const [generatedImageUrl, setGeneratedImageUrl] = useState('');
  
  // 处理类型/风格选择
  const handleTypeStyleSubmit = (type: string, style: string) => {
    setSelectedType(type);
    setSelectedStyle(style);
    setTypeModalVisible(false);
  };
  
  // 处理效果选择
  const handleEffectChange = (effect: string) => {
    setSelectedEffect(effect);
  };
  
  // 处理开始生成
  const handleGenerate = async () => {
    if (!inputText.trim()) {
      Alert.alert('提示', '请输入图片描述');
      return;
    }
    
    setIsGenerating(true);
    setGeneratedImageUrl(''); // 清空之前的内容
    setErrorMessage('');
    
    // 准备请求数据
    const prompt = `${selectedType}风格，${selectedStyle}，${inputText}`;
    const requestBody = {
      "bot_id": botId,
      "user_id": userId,
      "stream": true, // 使用流式响应
      "auto_save_history": true,
      "additional_messages": [
        {
          "role": "user",
          "content": prompt,
          "content_type": "text"
        }
      ]
    };

    try {
      const response = await fetch(apiUrl, {
        method: 'POST',
        headers: {
          "Authorization": apiKey,
          'Content-Type': 'application/json',
          'Accept': 'text/event-stream'
        },
        body: JSON.stringify(requestBody)
      });

      if (!response.ok) {
        throw new Error(`HTTP 错误! 状态: ${response.status}`);
      }

      // 获取文本响应并按行处理
      const responseText = await response.text();
      console.log('收到API响应');
      
      let urlFound = false;
      // 按行分割响应
      const lines = responseText.split('\n');
      
      for (const line of lines) {
        // 只处理data行
        if (line.trim().startsWith('data:')) {
          const jsonData = line.substring(5).trim();
          
          // 跳过空行和[DONE]标记
          if (!jsonData || jsonData === '[DONE]') continue;
          
          try {
            // 解析JSON
            const data = JSON.parse(jsonData);
            console.log('处理数据块:', JSON.stringify(data).substring(0, 100) + '...');
            
            // 专门查找type为answer的数据
            if (data.type === 'answer' && data.content && data.content_type === 'text') {
              console.log('找到answer类型数据');
              const contentStr = data.content;
              
              // 直接在content中查找https链接
              const urlMatch = contentStr.match(/(https?:\/\/[^\s"'<>]+)/);
              if (urlMatch && urlMatch[1]) {
                console.log('找到URL:', urlMatch[1]);
                setGeneratedImageUrl(urlMatch[1]);
                setIsGenerating(false);
                urlFound = true;
                break;
              }
              
              // 尝试解析content为JSON数组
              try {
                const contentArray = JSON.parse(contentStr);
                if (Array.isArray(contentArray) && contentArray.length > 0) {
                  const firstItem = contentArray[0];
                  if (typeof firstItem === 'string' && firstItem.startsWith('http')) {
                    console.log('从JSON数组中找到URL:', firstItem);
                    setGeneratedImageUrl(firstItem);
                    setIsGenerating(false);
                    urlFound = true;
                    break;
                  }
                }
              } catch (parseError) {
                console.log('content不是有效JSON');
                // content不是JSON，继续检查下一条数据
              }
            }
          } catch (e) {
            console.error('解析JSON数据失败:', e);
          }
        }
      }
      
      // 如果没有找到URL
      if (!urlFound) {
        console.log('未找到有效的图片URL');
        setErrorMessage('未能从API响应中提取图片URL');
        setIsGenerating(false);
        
        // 测试模式：使用模拟URL
        setTimeout(() => {
          setGeneratedImageUrl('https://placekitten.com/400/400');
          setErrorMessage('');
          setIsGenerating(false);
        }, 1000);
      }
    } catch (error) {
      console.error('API请求失败:', error);
      setErrorMessage(`获取图片失败: ${error.message}`);
      setIsGenerating(false);
    }
  };
  
  // 返回输入界面
  const handleBackToInput = () => {
    setIsGenerating(false);
    setErrorMessage('');
    setGeneratedImageUrl('');
  };

  // 处理复制图片链接
  const handleCopyImageUrl = () => {
    if (generatedImageUrl) {
      Clipboard.setString(generatedImageUrl);
      Alert.alert('成功', '图片链接已复制到剪贴板');
    }
  };
  
  // 清空生成的结果
  const handleClearResult = () => {
    setGeneratedImageUrl('');
    setIsGenerating(false);
    setErrorMessage('');
    
    // 滚动回顶部
    if (scrollViewRef.current) {
      scrollViewRef.current.scrollTo({ x: 0, y: 0, animated: true });
    }
  };
  
  // 处理图片下载
  const handleDownloadImage = async () => {
    if (!generatedImageUrl) {
      Alert.alert('提示', '没有可下载的图片');
      return;
    }
    
    try {
      // 请求媒体库权限
      const { status } = await MediaLibrary.requestPermissionsAsync();
      
      if (status !== 'granted') {
        Alert.alert('权限错误', '需要存储权限才能保存图片');
        return;
      }
      
      // 显示下载中提示
      Alert.alert('提示', '正在下载图片，请稍候...');
      
      // 创建临时文件路径
      const fileUri = FileSystem.documentDirectory + `ai_image_${Date.now()}.jpg`;
      
      // 下载图片到临时目录
      const downloadResult = await FileSystem.downloadAsync(generatedImageUrl, fileUri);
      
      if (downloadResult.status !== 200) {
        throw new Error('下载图片失败');
      }
      
      // 保存到媒体库
      const asset = await MediaLibrary.createAssetAsync(downloadResult.uri);
      const album = await MediaLibrary.getAlbumAsync('AI生成图片');
      
      if (album) {
        await MediaLibrary.addAssetsToAlbumAsync([asset], album, false);
      } else {
        await MediaLibrary.createAlbumAsync('AI生成图片', asset, false);
      }
      
      // 完成下载
      Alert.alert('成功', '图片已保存到相册，可在"AI生成图片"相册中查看');
      
    } catch (error) {
      console.error('保存图片时出错:', error);
      
      // 更友好的错误消息
      let errorMessage = '保存图片失败';
      if (error.message.includes('permission')) {
        errorMessage = '保存失败：缺少存储权限';
      } else if (error.message.includes('network') || error.message.includes('download')) {
        errorMessage = '下载失败：网络错误或图片链接无效';
      }
      
      Alert.alert('错误', errorMessage);
    }
  };
  
  useEffect(() => {
    if (isGenerating) {
      // 生成页面显示返回按钮
      navigation.setOptions({
        headerLeft: () => (
          <TouchableOpacity style={styles.headerButton} onPress={handleBackToInput}>
            <Text style={styles.headerButtonText}>返回</Text>
          </TouchableOpacity>
        ),
      });
    } else {
      // 恢复默认导航栏
      navigation.setOptions({
        headerLeft: undefined,
      });
    }
  }, [isGenerating, navigation]);
  
  return (
    <SafeAreaView style={styles.safeArea}>
      <View style={styles.header}>
        <TouchableOpacity onPress={() => navigation.goBack()}>
          <Text style={styles.backButton}>{'<'}</Text>
        </TouchableOpacity>
        <Text style={styles.title}>AI图片生成</Text>
        <View style={styles.emptySpace}></View>
      </View>
      
      <ScrollView 
        ref={scrollViewRef}
        style={styles.scrollView}
        contentContainerStyle={styles.scrollContent}
      >
        {/* 输入部分始终显示 */}
        <View style={styles.inputContainerOuter}>
          <ColorfulBorder>
            <TextInput
              style={styles.input}
              placeholder="例如：一个美丽的女孩在森林中"
              placeholderTextColor="#999"
              multiline
              value={inputText}
              onChangeText={(text) => {
                setInputText(text);
                setTextLength(text.length);
              }}
              maxLength={maxLength}
            />
            <Text style={styles.counter}>{textLength}/{maxLength}</Text>
          </ColorfulBorder>
        </View>
        
        <TouchableOpacity 
          style={styles.optionContainer} 
          onPress={() => setTypeModalVisible(true)}
        >
          <Text style={styles.optionLabel}>图片类型/风格</Text>
          <View style={styles.optionValueContainer}>
            <Text style={styles.optionValue}>{selectedType}/{selectedStyle}</Text>
            <Text style={styles.arrowRight}>{'>'}</Text>
          </View>
        </TouchableOpacity>
        
        <View style={styles.effectContainer}>
          <Text style={styles.effectTitle}>效果</Text>
          <View style={styles.effectOptions}>
            <TouchableOpacity 
              style={selectedEffect === '优质' ? styles.effectOptionSelected : styles.effectOption}
              onPress={() => handleEffectChange('优质')}
            >
              <Text style={selectedEffect === '优质' ? styles.effectOptionTextSelected : styles.effectOptionText}>优质</Text>
            </TouchableOpacity>
            
            <TouchableOpacity 
              style={selectedEffect === '超优质' ? styles.effectOptionSelected : styles.effectOption}
              onPress={() => handleEffectChange('超优质')}
            >
              <Text style={selectedEffect === '超优质' ? styles.effectOptionTextSelected : styles.effectOptionText}>超优质</Text>
            </TouchableOpacity>
          </View>
          <Text style={styles.effectNote}>注：使用优质模型，图片效果更好。</Text>
        </View>
        
        <TouchableOpacity 
          style={styles.generateButton} 
          onPress={handleGenerate}
          disabled={isGenerating}
        >
          {isGenerating ? (
            <ActivityIndicator color="#fff" />
          ) : (
            <Text style={styles.generateText}>开始生成</Text>
          )}
        </TouchableOpacity>
        
        <Text style={styles.disclaimer}>内容由AI生成，不可视为真实数据，不可作非法用途。</Text>
        
        {/* 生成结果部分 - 只在有内容或正在生成时显示 */}
        {(isGenerating || generatedImageUrl || errorMessage) && (
          <View style={styles.resultSection}>
            <View style={styles.resultSeparator} />
            
            <View style={styles.resultSectionHeader}>
              <Text style={styles.resultSectionTitle}>生成结果</Text>
              <TouchableOpacity onPress={handleClearResult}>
                <Text style={styles.clearButtonText}>清空</Text>
              </TouchableOpacity>
            </View>
            
            {isGenerating ? (
              <View style={styles.loadingContainer}>
                <ActivityIndicator size="large" color="#4a90e2" />
                <Text style={styles.loadingText}>正在生成图片，请稍候...</Text>
              </View>
            ) : errorMessage ? (
              <View style={styles.errorContainer}>
                <Text style={styles.errorText}>{errorMessage}</Text>
              </View>
            ) : (
              <>
                {/* 图片结果部分 */}
                <View style={styles.imageContainer}>
                  <Text style={styles.imagePrompt}>提示词：{inputText}</Text>
                  
                  {generatedImageUrl ? (
                    <Image
                      source={{ uri: generatedImageUrl }}
                      style={styles.generatedImage}
                      resizeMode="contain"
                    />
                  ) : (
                    <View style={styles.imagePlaceholder}>
                      <Text>图片将显示在此处</Text>
                    </View>
                  )}
                </View>

                {/* 底部操作按钮 */}
                <View style={styles.actionButtonsContainer}>
                  <TouchableOpacity style={styles.actionIconButton} onPress={handleCopyImageUrl}>
                    <Text style={styles.actionButtonIcon}>⎘</Text>
                    <Text style={styles.iconButtonText}>复制链接</Text>
                  </TouchableOpacity>
                  
                  <TouchableOpacity style={styles.actionIconButton} onPress={handleDownloadImage}>
                    <Text style={styles.actionButtonIcon}>↓</Text>
                    <Text style={styles.iconButtonText}>保存图片</Text>
                  </TouchableOpacity>
                </View>
              </>
            )}
          </View>
        )}
      </ScrollView>
      
      {/* 图片类型模态框 - 这里只是一个示例，实际应用中需要实现 */}
      {typeModalVisible && (
        <View style={styles.modalOverlay}>
          <View style={styles.modalContent}>
            <TouchableOpacity
              style={styles.closeButtonContainer}
              onPress={() => setTypeModalVisible(false)}
            >
              <Text style={styles.closeButton}>✕</Text>
            </TouchableOpacity>
            
            <Text style={styles.modalTitle}>选择图片类型/风格</Text>
            
            <View style={styles.typeOptions}>
              <TouchableOpacity
                style={[styles.typeOption, selectedType === '动漫人物' && styles.selectedTypeOption]}
                onPress={() => handleTypeStyleSubmit('动漫人物', '写实')}
              >
                <Text style={[styles.typeOptionText, selectedType === '动漫人物' && styles.selectedTypeOptionText]}>
                  动漫人物
                </Text>
              </TouchableOpacity>
              
              <TouchableOpacity
                style={[styles.typeOption, selectedType === '写实人物' && styles.selectedTypeOption]}
                onPress={() => handleTypeStyleSubmit('写实人物', '高清')}
              >
                <Text style={[styles.typeOptionText, selectedType === '写实人物' && styles.selectedTypeOptionText]}>
                  写实人物
                </Text>
              </TouchableOpacity>
              
              <TouchableOpacity
                style={[styles.typeOption, selectedType === '动漫风景' && styles.selectedTypeOption]}
                onPress={() => handleTypeStyleSubmit('动漫风景', '清新')}
              >
                <Text style={[styles.typeOptionText, selectedType === '动漫风景' && styles.selectedTypeOptionText]}>
                  动漫风景
                </Text>
              </TouchableOpacity>
              
              <TouchableOpacity
                style={[styles.typeOption, selectedType === '写实风景' && styles.selectedTypeOption]}
                onPress={() => handleTypeStyleSubmit('写实风景', '自然')}
              >
                <Text style={[styles.typeOptionText, selectedType === '写实风景' && styles.selectedTypeOptionText]}>
                  写实风景
                </Text>
              </TouchableOpacity>
            </View>
          </View>
        </View>
      )}
    </SafeAreaView>
  );
};

const styles = StyleSheet.create({
  safeArea: {
    flex: 1,
    backgroundColor: '#f5f5f5',
  },
  header: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    paddingHorizontal: 20,
    paddingTop: 15,
    paddingBottom: 10,
    borderBottomWidth: 1,
    borderBottomColor: '#eee',
  },
  backButton: {
    fontSize: 24,
    paddingHorizontal: 5,
  },
  title: {
    fontSize: 18,
    fontWeight: 'bold',
  },
  scrollView: {
    flex: 1,
  },
  scrollContent: {
    padding: 15,
  },
  inputContainerOuter: {
    margin: 15,
  },
  colorfulBorderOuter: {
    borderRadius: 18,
    padding: 2,
    backgroundColor: '#fff',
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 1 },
    shadowOpacity: 0.1,
    shadowRadius: 2,
    elevation: 2,
    position: 'relative',
    overflow: 'hidden',
  },
  colorfulBorderInner: {
    backgroundColor: '#fff',
    borderRadius: 16,
    overflow: 'hidden',
  },
  colorBorderLeft: {
    position: 'absolute',
    left: 0,
    top: 0,
    bottom: 0,
    width: 2,
    backgroundColor: '#3ce8f0',
  },
  colorBorderTop: {
    position: 'absolute',
    left: 0,
    top: 0,
    right: 0,
    height: 2,
    backgroundColor: '#7e93ff',
  },
  colorBorderRight: {
    position: 'absolute',
    right: 0,
    top: 0,
    bottom: 0,
    width: 2,
    backgroundColor: '#a771ff',
  },
  colorBorderBottom: {
    position: 'absolute',
    left: 0,
    bottom: 0,
    right: 0,
    height: 2,
    backgroundColor: '#7e93ff',
  },
  input: {
    minHeight: 100,
    fontSize: 16,
    textAlignVertical: 'top',
    padding: 15,
    backgroundColor: '#fff',
  },
  counter: {
    alignSelf: 'flex-end',
    color: '#999',
    marginTop: 5,
    marginRight: 10,
    marginBottom: 5,
  },
  optionContainer: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    margin: 15,
    marginTop: 5,
    marginBottom: 15,
    padding: 15,
    backgroundColor: '#fff',
    borderRadius: 10,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 1 },
    shadowOpacity: 0.1,
    shadowRadius: 2,
    elevation: 2,
  },
  optionLabel: {
    fontSize: 16,
    fontWeight: 'bold',
  },
  optionValueContainer: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  optionValue: {
    fontSize: 16,
    color: '#333',
    marginRight: 10,
  },
  arrowRight: {
    fontSize: 18,
    color: '#999',
  },
  effectContainer: {
    margin: 15,
    padding: 15,
    backgroundColor: '#fff',
    borderRadius: 10,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 1 },
    shadowOpacity: 0.1,
    shadowRadius: 2,
    elevation: 2,
  },
  effectTitle: {
    fontSize: 16,
    fontWeight: 'bold',
    marginBottom: 15,
  },
  effectOptions: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    marginBottom: 15,
  },
  effectOption: {
    backgroundColor: '#f0f0f0',
    paddingVertical: 8,
    paddingHorizontal: 15,
    borderRadius: 20,
    marginRight: 10,
    marginBottom: 10,
  },
  effectOptionSelected: {
    backgroundColor: '#4a90e2',
    paddingVertical: 8,
    paddingHorizontal: 15,
    borderRadius: 20,
    marginRight: 10,
    marginBottom: 10,
  },
  effectOptionText: {
    color: '#333',
  },
  effectOptionTextSelected: {
    color: '#fff',
  },
  effectNote: {
    color: '#999',
    fontSize: 14,
  },
  generateButton: {
    margin: 15,
    padding: 15,
    backgroundColor: '#4a90e2',
    borderRadius: 25,
    alignItems: 'center',
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.2,
    shadowRadius: 3,
    elevation: 3,
  },
  generateText: {
    color: '#fff',
    fontSize: 18,
    fontWeight: '500',
  },
  disclaimer: {
    textAlign: 'center',
    color: '#999',
    marginVertical: 20,
    marginHorizontal: 15,
    fontSize: 12,
  },
  resultSection: {
    padding: 15,
    backgroundColor: '#fff',
    borderRadius: 10,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 1 },
    shadowOpacity: 0.1,
    shadowRadius: 2,
    elevation: 2,
  },
  resultSeparator: {
    height: 1,
    backgroundColor: '#eee',
    marginVertical: 15,
  },
  resultSectionHeader: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
  },
  resultSectionTitle: {
    fontSize: 18,
    fontWeight: 'bold',
    marginBottom: 10,
    color: '#333',
  },
  clearButtonText: {
    color: '#4a90e2',
    fontSize: 16,
    fontWeight: '500',
  },
  loadingContainer: {
    alignItems: 'center',
    justifyContent: 'center',
    padding: 20,
    minHeight: 300,
  },
  loadingText: {
    marginTop: 20,
    fontSize: 16,
    color: '#666',
  },
  errorContainer: {
    padding: 20,
    alignItems: 'center',
    justifyContent: 'center',
    minHeight: 100,
  },
  errorText: {
    color: 'red',
    fontSize: 16,
    textAlign: 'center',
  },
  imageContainer: {
    backgroundColor: '#fff',
    borderRadius: 10,
    padding: 15,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 1 },
    shadowOpacity: 0.1,
    shadowRadius: 2,
    elevation: 2,
  },
  imagePrompt: {
    fontSize: 16,
    fontWeight: 'bold',
    marginBottom: 15,
    color: '#333',
  },
  imagePlaceholder: {
    width: '100%',
    height: 300,
    backgroundColor: '#f0f0f0',
    borderRadius: 5,
    justifyContent: 'center',
    alignItems: 'center',
  },
  generatedImage: {
    width: '100%',
    height: 300,
    borderRadius: 5,
  },
  actionButtonsContainer: {
    flexDirection: 'row',
    justifyContent: 'center',
    marginTop: 15,
    gap: 15, // 按钮之间的间距
  },
  actionIconButton: {
    flexDirection: 'row',
    alignItems: 'center',
    padding: 10,
    borderWidth: 1,
    borderColor: '#eee',
    borderRadius: 8,
    backgroundColor: '#f9f9f9',
  },
  actionButtonIcon: {
    fontSize: 18,
    marginRight: 5,
  },
  iconButtonText: {
    color: '#333',
    fontSize: 16,
    fontWeight: '500',
  },
  headerButton: {
    padding: 10,
  },
  headerButtonText: {
    color: '#333',
    fontSize: 16,
    fontWeight: '500',
  },
  emptySpace: {
    width: 40, // 与返回按钮大致相同的宽度
  },
  // 模态框样式
  modalOverlay: {
    position: 'absolute',
    top: 0,
    left: 0,
    right: 0,
    bottom: 0,
    backgroundColor: 'rgba(0, 0, 0, 0.5)',
    justifyContent: 'center',
    alignItems: 'center',
    zIndex: 1000,
  },
  modalContent: {
    width: '80%',
    backgroundColor: 'white',
    borderRadius: 10,
    padding: 20,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.25,
    shadowRadius: 3.84,
    elevation: 5,
  },
  closeButtonContainer: {
    position: 'absolute',
    top: 10,
    right: 10,
  },
  closeButton: {
    fontSize: 20,
    color: '#999',
  },
  modalTitle: {
    fontSize: 18,
    fontWeight: 'bold',
    marginBottom: 20,
    textAlign: 'center',
  },
  typeOptions: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'space-between',
  },
  typeOption: {
    width: '48%',
    backgroundColor: '#f0f0f0',
    paddingVertical: 12,
    paddingHorizontal: 10,
    borderRadius: 8,
    marginBottom: 10,
    alignItems: 'center',
  },
  selectedTypeOption: {
    backgroundColor: '#e6f0ff',
    borderWidth: 1,
    borderColor: '#4a90e2',
  },
  typeOptionText: {
    fontSize: 14,
    color: '#333',
  },
  selectedTypeOptionText: {
    color: '#4a90e2',
    fontWeight: 'bold',
  },
});

export default AIImageGenerationScreen; 